<style scoped lang="scss">
.cart {
  width: 10rem;
  height: 1.3333rem;
  background-color: rgb(221, 221, 221);
  margin-top: 1.1rem;

  .cartbox {
    width: 10rem;
    height: 3.1467rem;
    background-color: #fff;

    .cartbox-left {
      width: 1.3333rem;
      height: 3.1467rem;
      margin-left: 0.4rem;
      margin-top: 0.4rem;
      // background-color: pink;
      @include flex-center;

      input {
        width: .6rem;
        height: .4rem;
        border-radius: 50%;
        border: 1px solid #ddd;
        padding: 2px;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        outline: none;
      }

      input:checked {
        background: #409EFF url("data:image/svg+xml;utf8,<svg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'><path d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/></svg>") no-repeat center;
        background-size: 60%;
      }
    }
  }
}
</style>
<template>
  <div class="cart">
    <div class="cartbox">
      <div class="cartbox-left">
        <input type="checkbox" name="" id="">
      </div>
      <div class="carbox-center">

      </div>
    </div>
  </div>
</template>